<template>
  <div class="journal-part-3">
    <div class="part-title">Part III - {{$t('btnText.task.part_3')}}</div>
    <div class="content-desc" v-html="data">
    </div>
    <div class="footer-btn">
      <a-button @click="goto('/member/journal', { step: 2 })">{{$t('btnText.prev_step')}}</a-button>
      <a-button type="primary" @click="goto('/member/journal', { step: 4 })"
        >{{$t('btnText.next_step')}}</a-button
      >
    </div>
  </div>
</template>

<script setup lang="ts">
import { onBeforeMount, ref } from "vue";
import { postOnePageQuery } from "../../../../api/banner";

const data = ref("")
const getData = async () => {
  let res = await postOnePageQuery(9);
  if(res.code === 200) {
    data.value = res.data
  }
};

onBeforeMount(() => {
  getData()
})
</script>
<style scoped lang="less">
@import url('./common.less');
@media screen and (max-width: 768px) {
  .journal-part-3 {
    padding: 82px;
  }
}
</style>
